<template>
	<el-popover
		v-model="showPopover"
		title="选择要删除的日期"
		width="360"
		icon="el-icon-info"
		trigger="manual"
	>
		<div>
			<jk-date-picker
				v-model="dateRange"
				type="daterange"
				start-placeholder="开始日期"
				end-placeholder="结束日期"
			></jk-date-picker>
		</div>
		<div class="flex-end-center margin-top-10">
			<el-button size="small" @click="showPopover = false">取消</el-button>
			<el-button :loading="confirmBtnLoading" size="small" type="primary" @click="onConfirmBtn">确定</el-button>
		</div>
		<el-button slot="reference" :size="size" icon="el-icon-folder-delete" class="current-month" @click="showPopover = true">批量删除班组</el-button>
	</el-popover>
</template>
<script>
    import {
        workforceManagementScheduleDeleteScheduleGroup
    } from '../../../../api/schedule/scheduling';
    import { tipsBar } from '../../../../utils/jk/jk-tool';

    export default {
        props: {
            workshopId: {
                type: [String, Number],
                default: ''
            },
            size: {
                type: String,
                default: ''
            },
            checkData: {
                type: Object,
                default() {
                    return {};
                }
            }
        },
        data() {
            return {
                dateRange: [],
                confirmBtnLoading: false,
                showPopover: false
            };
        },
        methods: {
            onConfirmBtn() {
                if (this.dateRange && this.dateRange.length) {
                    this.confirmBtnLoading = true;
                    workforceManagementScheduleDeleteScheduleGroup({
                        workshopId: this.workshopId,
                        beginDate: this.dateRange[0],
                        endDate: this.dateRange[1]
                    }).then(res => {
                        this.confirmBtnLoading = false;
                        if (res.data.status === 200) {
                            tipsBar(this, 'save');
                            this.showPopover = false;
                            this.$emit('on-confirm');
                        }
                    });
                }
            }
        },
        watch: {
            showPopover(newVal) {
                if (!newVal) {
                    this.dateRange = [];
                }
            }
        }
    };
</script>
